<template>
  <swiper class="swiper" circular :indicator-dots="false" :autoplay="true" :interval="3000" :duration="500">
    <swiper-item
        v-for="item in list"
        :key="item.id"
        class="swiper-item"
    >
      <view class="image" @click="handleSwiper(item)" v-if="item.image">
        <v-image :url="item.image.path" v-if="item.image" :width="'710rpx'" :height="'940rpx'" :duration="10" :is-fade="true" />
      </view>
    </swiper-item>
  </swiper>
</template>

<script>
import Image from '../../../../components/image/index'

import { goTo } from '../../../../util/util'

export default {
  props: ['list'],
  components: {
    'v-image': Image
  },
  data() {
    return {
    }
  },
  methods: {
    handleSwiper(item) {
      goTo(item)
    }
  }
}
</script>

<style scoped lang="scss">
.swiper {
  margin: 0 20rpx;
  height: 940rpx;
  //background: white;
  border-radius: 20rpx;
  overflow: hidden;
  /* 兼容ISO圆角 */
  transform: translateY(0);
  .image {
  }
}
</style>
